<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<link href="${basePath}/css/style.css" rel="stylesheet" type="text/css" />
<link href="${basePath}/css/my.css" rel="stylesheet" type="text/css" />
<link rel="stylesheet" type="text/css" href="${basePath}/css/jquery.validate.css"/>
<script type="text/javascript" src="${basePath}/js/validation/jquery-1.8.3.js"></script>
<script type="text/javascript" src="${basePath}/js/validation/jquery.validate.min.js"></script>
<script type="text/javascript" src="${basePath}/js/validation/messages_zh.js"></script>

<script type="text/javascript">
	$(document).ready(function() {
		var te = "${product.properties}";
		if(te==null||te==""||te=="[]"){
			$("#nuu").show();
		}
		
		$(".click").click(function() {
			$(".tip3").fadeIn(200);
		});

		$(".tiptop a").click(function() {
			$(".tip").fadeOut(200);
			$(".tip2").fadeOut(200);
			$(".tip3").fadeOut(200);
			$(".tip4").fadeOut(200);
		});

		$(".sure").click(function() {
			
		});

		$(".cancel").click(function() {
			$(".tip").fadeOut(100);
			$(".tip2").fadeOut(100);
			$(".tip3").fadeOut(200);
			$(".tip4").fadeOut(200);
		});
		
		$(".tablelink").click(function() {
			$(".tip4").fadeIn(200);
		});
		
		$("#mainFrom").validate({
			rules:{
				"type" : "required",
				"text" : "required"
			},
			message:{
				
			}
		});

	});
	
	function onck(id,name,text) {
		$('#id').val(id);
		$('#type').val(name);
		$('#text').val(text);
		$(".tip2").fadeIn(200);
	}
	
	function onck2(id,name,text) {
		$('#id2').val(id);
		$('#type2').val(name);
		$('#text2').val(text);
		$(".tip4").fadeIn(200);
	}


	function isfile() {
		var file = $("#imgFile").val();
		if (file != null) {
			$("#title").val("图片已成功上传图片");
			$("#title").css("color", "#00F");
		}
	}

	function isfile2() {
		var file = $("#imgFile2").val();
		if (file != null) {
			$("#title2").val("图片已成功上传图片");
			$("#title2").css("color", "#00F");
		}
	}
	
	function findnext() {
		var cate = $("#category").val();
		var path = "${basePath}";
		$.ajax({
			url : path + '/product/bycate',
			type : 'POST', // GET
			async : false, // 或false,是否异步
			data : {
				'id' : cate
			},
			timeout : 5000, // 超时时间
			dataType : 'json', // 返回的数据格式：json/xml ml/script/jsonp/text
			success : function(data) {
				$("#classId option").remove();
				$("#classId").append("<option value='0'>请选择</option>");
				if (data != 0) {
					for (var i = 0; i < data.length; i++) {
						var classId = data[i].id;
						var className = data[i].name;
						$("#classId").append(
								"<option value="+classId+">"+ className
										+ "</option>");
					}
				}
			},
			error : function(xhr, textStatus) {
				alert('错误' + textStatus);
			}
		});
	}
</script>
</head>
<body>
	<div class="place">
		<span>位置：</span>
		<ul class="placeul">
			<li><a href="#">首页</a></li>
			<li><a href="#">商品管理</a></li>
			<li><a href="#">商品备注管理</a></li>
		</ul>
	</div>
	
		<div class="rightinfo">
	
			<div class="tools">

			<ul class="toolbar">
				<li><a href="javascript :;"
					onclick="javascript:history.back(-1);" style="color:#000"><span><img
							src="${basePath}/images/back_bb.jpg" /></span>返回</a></li>
			</ul>
			<ul class="toolbar">
				<li class="click"><span><img
						src="${basePath}/images/t01.png" /></span>添加</li>
			</ul>
		</div>

		<table class="tablelist">
			<thead>
				<tr>
					<th>编号</th>
					<th>属于商品</th>
					<th>备注类型</th>
					<th>正文</th>
					<th>操作</th>
				</tr>
			</thead>
			<c:forEach items="${product.note}" var="item" varStatus="s">
				<tr>
					<td>${item.id}</td>
					<td>${product.name}</td>
					<td>${item.type}</td>
					<td>${item.text}</td>
					<td><a style="color:#00F" href="javascript:void(0)" class="tablelink" onclick="onck2('${item.id}','${item.type}','${item.text}')">修改</a> 
					<a style="color:#00F" href="javascript:void(0)" class="delete" onclick="onck('${item.id}','${item.type}','${item.text}')">删除</a></td>
				</tr>
			</c:forEach>
		</table>
		<div id="nuu" style="display:none">
			<span align=center><image src="${basePath}/images/img14.png"></image></span>
			<span align=center>${product.name}--该商品还没有备注信息哦！快去添加</span>
		</div>

		<div class="tip2">
			<div class="tiptop">
				<span>商品备注删除</span><a></a>
			</div>

			<form method="post" action="${basePath}/product/deletenote" class="basic-grey" enctype="multipart/form-data">
				<h1>
					删除商品备注</span><span>对商品的某一条备注信息进行删除</span>
				</h1>
				<input type="hidden" name="productId" value="${product.id}"/> 
				<input id="id" type="hidden" name="id"/> 
				<label> 
					<span>备注类型 :</span> 
					<input id="type" type="text" name="type" readonly="true" />
				</label>	
				<label> 
					<span>正文 :</span> 
					<input id="text" type="text" name="text" readonly="true" />
				</label>		
				<label> 
					<span>属于商品 :</span> 
					<input type="text" name="product" readonly="true" value="${product.name}"/>
				</label>			
				<div class="tipbtn">
					<input name="" type="submit" class="sure" value="删除" />&nbsp; <input
						name="" type="button" class="cancel" value="取消" />
				</div>
			</form>
		</div>

		<div class="tip3">
			<div class="tiptop">
				<span>添加商品备注</span><a></a>
			</div>

			<form id="mainFrom" method="post" action="${basePath}/product/insernote" class="basic-grey" enctype="multipart/form-data">
				<h1>
					添加备注信息 <span>为你所选择的商品添加备注信息<span style="color:#F00">该商品为${product.name}</span></span>
				</h1>
				<input type="hidden" name="productId" value="${product.id}"/> 
				<label> 
					<span>备注类型 :</span> 
					<select name="type">
						<option value="">--请选择--</option>
						<option value="注意">注意</option>
						<option value="警告">警告</option>
						<option value="提示">提示</option>
						<option value="建议">建议</option>
						<option value="要求">要求</option>
						<option value="其他">其他</option>
					</select>
				</label>
				<label> 
					<span>正文 :</span> 
					<input id="text" type="text" name="text" />
				</label>
				<div class="tipbtn">
					<input name="" type="submit" class="sure" value="添加" />&nbsp; <input
						name="" type="button" class="cancel" value="取消" />
				</div>
			</form>
		</div>
		
		<div class="tip4">
			<div class="tiptop">
				<span>修改商品备注信息</span><a></a>
			</div>

			<form method="post" action="${basePath}/product/modifynote" class="basic-grey" enctype="multipart/form-data">
				<h1>
					商品备注的修改 <span>对商品备注的一些值进行修改</span>
				</h1>
				<input type="hidden" name="productId" value="${product.id}"/> 
				<input type="hidden" id="id2" name="id"/> 
				<label> 
					<span>备注类型 :</span> 
					<select id="type2" name="type">
						<option value="">--请选择--</option>
						<option value="注意">注意</option>
						<option value="警告">警告</option>
						<option value="提示">提示</option>
						<option value="建议">建议</option>
						<option value="要求">要求</option>
						<option value="其他">其他</option>
					</select>
				</label>
				<label> 
					<span>正文 :</span> 
					<input id="text2" type="text" name="text" />
				</label>
				<label> 
				<span>商品分类 :</span> 
				<select id="category" name="pid" onchange="findnext()">
						<option value="">--请选择--</option>
						<c:forEach items="${list2}" var="item2" varStatus="s">
							<option value="${item2.id}">${item2.name}</option>
						</c:forEach>
				</select>
				</label>
				<label> <span>链接商品 :</span> <select id="classId" name="productId">
						<option value="${product.id}">${product.name}</option>
				</select>
				</label>
				<div class="tipbtn">
					<input name="" type="submit" class="sure" value="修改" />&nbsp; <input
						name="" type="button" class="cancel" value="取消" />
				</div>
			</form>
		</div>

		<script type="text/javascript">
			$('.tablelist tbody tr:odd').addClass('odd');
		</script>
</body>

</html>
